<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>Data-Table 表格</title>
    <link rel="stylesheet" href="../../frame/layui/css/layui.css">
    <link rel="stylesheet" href="../../frame/static/css/style.css">
    <link rel="stylesheet" href="../../css/common.css">
    <link rel="stylesheet" href="../../css/user/index.css">
    <link rel="icon" href="../../frame/static/image/code.png">
  <style>.edit{cursor: pointer;}</style>
</head>
<body class="body">
<!-- 工具集 -->
<div class="my-btn-box">
    <span class="fl">
        <a class="layui-btn btn-add btn-default" id="btn-refresh" onclick="location.reload()"><i class="layui-icon">&#x1002;</i></a>
    </span>
    <span class="fr">
    <span class="layui-form-label">搜索条件：</span>
    <div class="layui-input-inline" >
    <input type="text" autocomplete="off" value="" placeholder="请输入手机号查询" class="layui-input search" name="phone" style="width:150px">
    </div>
    <a class="layui-btn mgl-20" id="search">查询</a>
    </span>
</div>

<!-- 表格 -->
<div class="dateTable">
    <div class="table-title">
        <div style="width: 7%">昵称</div>
        <div style="width: 10%">手机号</div>
        <div style="width: 7%" >头像</div>
        <div style="width: 5%" >积分</div>
      	<div style="width: 7%">vip等级</div>
        <div style="width: 15%">vip时间</div>
        <div style="width: 15%">最后登录时间</div>
        <div style="width: 15%">创建时间</div>
        <div style="width: 10%">操作</div>
    </div>
    <table class="data-table" id="data-table" style="position:relative;z-index:9999">
    </table>
  	<div id="pagebox"></div>
</div>
<script src="../../js/public/jquery-3.1.1.min.js"></script>
<script src="../../js/layer/layer.js"></script>
<script src="../../js/public/common.js"></script>
<script>
  $(function(){
    userList();
    usersearch();
    

});

function usersearch() {
    $('#search').click(function(){
        userList();
    })
}
function userList(){
    let nickname = $('input[name="nickname"]').val();
    let phone    = $('input[name="phone"]').val();
    let page = GetQueryString('page');
    if(!page || page <=0)page = 1;
    let ref = {
        nickname:nickname,
        page:page,
        limit:limit,
        phone:phone,
    };
    page = parseInt(page);
    let res = AjaxForm('admin/userList','get',ref);
    let data = res.list;
    let html ='';
    let pageHtml = '';
    if(res.count < 1){
        lay('没有更多数据了');
        html = `<tr></tr>`;
    }else{
        for (let i=0;i<=data.length-1;i++){
          	let vip = '普通用户';
          	if(data[i].vip == 1){
            	vip = '普通vip用户'
            }else if(data[i].vip == 2){
            	vip = 'svip用户'
            }
          	let expire = formatDateTime(data[i].expire);
          	if(data[i].vip == 0 && data[i].expire == 0)expire = '未订阅服务'
          	if(data[i].vip == 2 && data[i].expire == 0)expire = '永久';
            html +=
                "<tr class=\"table-content\" style='height: 50px;'>\n" +
                "<td style=\" line-height: 50px;height: 50px;width: 7%\">"+data[i].nickname+"</td>" +
                "<td style=\" line-height: 50px;height: 50px;width: 10%\">"+data[i].phone+"</td>" +
                "<td style=\" line-height: 50px;height: 50px;width: 7%\"><img style='height: 45px' src='"+data[i].headimg+"'></td>" +
                "<td style=\" line-height: 50px;height: 50px;width: 5%\">"+data[i].integral+"</td>" +
              	"<td style=\" line-height: 50px;height: 50px;width: 7%\" class='edit vip' vip="+data[i].vip+" uid="+data[i].uid+">"+vip+"</td>" +
             	"<td style=\" line-height: 50px;height: 50px;width: 15%\" class='edit expire' expire="+data[i].expire+" uid="+data[i].uid+">"+expire+"</td>" +
                "<td style=\" line-height: 50px;height: 50px;width: 15%\">"+formatDateTime(data[i].log_time)+"</td>" +
                "<td style=\" line-height: 50px;height: 50px;width: 15%\">"+formatDateTime(data[i].create_time)+"</td>" +
                "<td style=\" line-height: 50px;height: 50px;width: 10%\">"+
                // "<!--<a class=\"layui-btn layui-btn-mini\" lay-event=\"detail\">查看</a>-->\n" +
                 "<a class=\"zhuxiao layui-btn layui-btn-mini layui-btn-normal\" ids='"+data[i].uid+"'>注销登陆</a>" +
                "<a class=\"detail layui-btn layui-btn-mini layui-btn-danger\" ids='"+data[i].uid+"'>详情</a>" +
                "</td>\n" +
                "</tr>"
        }
        //todo 分页
       // pageHtml = WepPage(res.count,page,limit,"list");
    }
  	WepPage(res.count,page,'list');
    html += pageHtml;
    $('#data-table').html(html);
  
  	$('.vip').click(function(){
      	let uid = $(this).attr('uid')
        let vip = $(this).attr('vip')
        layOpen('编辑','600px','400px','edit.html?vip='+vip+'&uid='+uid)
    })
  
  	$('.expire').click(function(){
      	let uid = $(this).attr('uid')
        let expire = $(this).attr('expire')
        layOpen('编辑','600px','400px','edit.html?expire='+expire+'&uid='+uid)
    })
  
  
  	//todo 编辑
    $('.update').click(function(){
        let id = $(this).attr('ids');
        let urls = "../user/edit.html?id="+id;
        layOpen('编辑用户信息','90%','600px',urls)
    });

    //todo 删除
    $('.del').click(function(){
        let id = $(this).attr('ids');
        let data = {'admin_id':id};
        let urls = url+'admin/adminDel';
        layFirm('删除',urls,data);
    });

    //todo 详情
    $('.detail').click(function(){
        let id = $(this).attr('ids');
        let urls = './detail.html?uid='+id;
        layOpen('用户详情','50%','600px',urls);
    })
    
    //todo 注销
    $('.zhuxiao').click(function(){
        let id = $(this).attr('ids');
      console.log(id);
        let data = {'uid':id};
        let urls = url+'admin/user/zhuxiao';
      	
        layFirm('注销登陆',urls,data);
    });
}




  
  </script>
</body>
</html>